<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html xmlns:th="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>Insert title here</title>
    <link rel="stylesheet" href="ftl/css/bootstrap.min.css">
    <script src="ftl/js/jquery/jquery.min.js"></script>
    <script src="ftl/js/jquery.validation/1.14.0/jquery.validate.min.js"></script>
    <script src="ftl/js/jquery.validation/1.14.0/messages_zh.min.js"></script>
    <style>
        input.error {
            border: 1px solid #DB7023;
        }
        .inputfile {
            opacity: 0;
        }
    </style>
</head>
<body>
<div class="container">
    <form id="Edit">
        <br/>
        <div class="form-group">
            <label for="carcode">车辆号码</label>
            <input type="text" class="form-control" id="carcode" name="carcode" placeholder="车辆号码"value="${carcode}">
        </div>
        <div class="form-group">
            <label for="carcolor">车辆颜色</label>
            <input type="text" class="form-control" id="carcolor" name="carcolor" placeholder="车辆颜色"value="${carcolor}">
        </div>
        <div class="form-group">
            <label for="buydate">购买日期</label>
            <input type="date" class="form-control" id="buydate" name="buydate" placeholder="购买日期" value="${budate?string('yyyy-MM-dd')}">
        </div>
        <div class="form-group">
            <label for="cartype">车辆类型</label>
            <select class="select" id="cartype" name="cartype" size="1" value="${cartype}">
                <option>请选择</option>
                <option value="经济型">经济型</option>
                <option value="舒适性">舒适性</option>
                <option value="精英型">精英型</option>
                <option value="SUV">SUV</option>
                <option value="七座MPV">七座MPV</option>
                <option value="电动型">电动型</option>

            </select>
        </div>
        <div class="form-group">
            <label for="carbrand">车辆品牌</label >
            <input type="text" class="form-control" id="carbrand" name="carbrand" placeholder="车辆品牌" value="${carbrand}">
        </div>
        <div class="form-group">
            <label for="carbrandtype">品牌型号</label>
            <input type="text" class="form-control" id="carbrandtype" name="carbrandtype" placeholder="品牌型号"value="${carbrandtype}">
        </div>
        <div class="form-group">
            <form action="" enctype="multipart/form-data" method="post" id="form">
                <input id="picid" class="inputfile" onchange="changepic(this)" name="files" type="file"><br>
                <img src="/img/${picid}" id="show" width="200">
                <label for="picid" class="btn btn-success">选择一个图片</label>
            </form>
        </div>
        <div class="form-group">
            <label for="seatnum">座位数量</label>
            <input type="text" class="form-control" id="seatnum" name="seatnum" placeholder="座位数量" value="${seatnum}">
        </div>
        <div class="form-group">
            <label for="totalmile">车辆里程</label>
            <input type="text" class="form-control" id="totalmile" name="totalmile" placeholder="车辆里程" value="${totalmile}">
        </div>
        <div class="form-group">
            <label for="hadillegal">现有违章</label>
            <input type="text" class="form-control" id="hadillegal" name="hadillegal" placeholder="现有违章" value="${hadillegal}">
        </div>
        <div class="form-group">
            <label for="insurer">投保单位</label>
            <input type="text" class="form-control" id="insurer" name="insurer" placeholder="投保单位"value="${insurer}">
        </div>
        <div class="form-group">
            <label for="insurancetime">保险时间</label>
            <input type="date" class="form-control" id="insurancetime" name="insurancetime" placeholder="保险时间"value="${insurancetime?string('yyyy-MM-dd')}">
        </div>
        <div class="form-group">
            <label for="yearcheck">年检时间</label>
            <input type="date" class="form-control" id="yearcheck" name="yearcheck" placeholder="年检时间" value="${yearcheck?string('yyyy-MM-dd')}">
        </div>
        <div class="form-group">
            <label for="maintaintime">保养时间</label>
            <input type="date" class="form-control" id="maintaintime" name="maintaintime" placeholder="保养时间" value="${maintaintime?string('yyyy-MM-dd')}">
        </div>
        <div class="form-group">
            <label for="maintainmile">保养里程</label>
            <input type="text" class="form-control" id="maintainmile" name="maintainmile" placeholder="保养里程" value="${maintainmile}">
        </div>
        <div class="form-group">
            <label for="safelevel">安全系数</label>
            <input type="text" class="form-control" id="safelevel" name="safelevel" placeholder="安全系数" value="${safelevel}">
        </div>
        <div class="form-group">
            <label for="carprice">车辆估值</label>
            <input type="text" class="form-control" id="carprice" name="carprice" placeholder="车辆估值"value="${carprice}">
        </div>
        <div class="form-group">
            <label for="evaluater">评估人员</label>
            <input type="text" class="form-control" id="evaluater" name="evaluater" placeholder="评估人员"value="${evaluater}">
        </div>
        <div class="form-group">
            <label for="carstate">车辆状态</label>
            <select class="form-control" id="carstate" name="carstate" size="1" v-model="selected">
                <option>请选择</option>
                <option value="待审核">待审核</option>
                <option value="不合格">不合格</option>
                <option value="已报废">已报废</option>
                <option value="待上架">待上架</option>
                <option value="待租赁">待租赁</option>
                <option value="自用中">自用中</option>
                <option value="维修中">维修中</option>
                <option value="保养中">保养中</option>
                <option value="年检中">年检中</option>
            </select>
        </div>
        <div class="form-group">
            <label for="deptname">所属部门名称</label>
            <input type="text" class="form-control" id="deptname" name="deptname" placeholder="所属部门名称"value="${deptname}">
        </div>
        <div class="form-group">
            <label for="carremark">车辆信息介绍</label>
            <input type="text" class="form-control" id="carremark" name="carremark" placeholder="车辆信息介绍"value="${carremark}">
        </div>
        <div class="form-group">
            <label for="carcity">所在区域城市</label>
            <input type="text" class="form-control" id="carcity" name="carcity" placeholder="所在区域城市"value="${carcity}">
        </div>
        <div class="form-group">
            <button type="button" id="save" class="btn btn-success">提交</button>
            <button type="button" id="cancelBtn" class="btn btn-default">取消</button>
        </div>
    </form>
</div>
<script>
    $(function () {
       $("#carstate option[value='${carstate}']").prop("selected",true)
    });
    $(function () {
        $("#cartype option[value='${cartype}']").prop("selected",true)
    });

    var updateUser = function () {
        $.ajax({
            type: "POST",
            dataType: "json",
            url: "/carsEdit",
            data: {
                carid: '${carid}',
                carcode: $("#carcode").val(),
                carcolor: $("#carcolor").val(),
                buydate: $("#buydate").val(),
                cartype: $("#cartype").val(),
                carbrand: $("#carbrand").val(),
                carbrandtype: $("#carbrandtype").val(),
                picid: $("#picid").val(),
                seatnum: $("#seatnum").val(),
                totalmile: $("#totalmile").val(),
                hadillegal: $("#hadillegal").val(),
                insurer: $("#insurer").val(),
                insurancetime: $("#insurancetime").val(),
                yearcheck: $("#yearcheck").val(),
                maintaintime: $("#maintaintime").val(),
                maintainmile: $("#maintainmile").val(),
                safelevel: $("#safelevel").val(),
                carprice: $("#carprice").val(),
                evaluater: $("#evaluater").val(),
                carstate: $("#carstate").val(),
                deptname: $("#deptname").val(),
                carremark: $("#carremark").val(),
                carcity: $("#carcity").val()
            },
            success: function (msg) {
                $("#cancelBtn").click();
            }
        });
    }

    $("#save").click(function () {
        updateUser();
    });

    $("#cancelBtn").click(function () {
        var index = parent.layer.getFrameIndex(window.name);
        parent.getUserPageList();
        parent.layer.close(index);
    });


    function check() {
        return $("#editUserForm").validate({
            rules: {
                userName: {
                    required: true
                },
                userPassword: {
                    required: true
                }
            },

            messages: {
                userName: {
                    required: ""
                },
                userPassword: {
                    required: ""
                }
            }

        });
    }
    if ($("#picid").val()!=""){
        $('#save').click(function () {
            var formData = new FormData();
            //获取选择的文件
            $.each($('input[name="files"]'), function (index, item) {
                formData.append("files", item.files[0])
            });

            //发送异步请求
            $.ajax({
                method: 'post',
                url: "/upload", // 文件上传接口
                data: formData,
                processData: false,
                contentType: false,
                success: function (data) {
                    console.log("成功")
                },
                //请求失败触发的方法
                error: function () {
                    console.log("失败")
                }
            });
        });
    }
    function changepic(obj) {
        //console.log(obj.files[0]);//这里可以获取上传文件的name
        var newsrc = getObjectURL(obj.files[0]);
        document.getElementById('show').src = newsrc;
    }

    //建立一個可存取到該file的url
    function getObjectURL(file) {
        var url = null;
        // 下面函数执行的效果是一样的，只是需要针对不同的浏览器执行不同的 js 函数而已
        if (window.createObjectURL != undefined) { // basic
            url = window.createObjectURL(file);
        } else if (window.URL != undefined) { // mozilla(firefox)
            url = window.URL.createObjectURL(file);
        } else if (window.webkitURL != undefined) { // webkit or chrome
            url = window.webkitURL.createObjectURL(file);
        }
        return url;
    }
</script>
</body>
